<!DOCTYPE html>
<html lang="en">

<head>

  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
  <meta name="description" content="">
  <meta name="author" content="">

  <title>Easy Python</title>

  <!-- Font Awesome Icons -->
  <link href="vendor/fontawesome-free/css/all.min.css" rel="stylesheet" type="text/css">

  <!-- Plugin CSS -->
  <link href="vendor/magnific-popup/magnific-popup.css" rel="stylesheet">

  <!-- Theme CSS - Includes Bootstrap -->
  <link href="css/creative.min.css" rel="stylesheet">

</head>

<body id="page-top">

  <!-- Navigation -->
  <nav class="navbar navbar-expand-lg navbar-light fixed-top py-3" id="mainNav">
    <div class="container">
      <a class="navbar-brand js-scroll-trigger" href="#">Easy Python</a>
      <button class="navbar-toggler navbar-toggler-right" type="button" data-toggle="collapse"
        data-target="#navbarResponsive" aria-controls="navbarResponsive" aria-expanded="false"
        aria-label="Toggle navigation">
        <span class="navbar-toggler-icon"></span>
      </button>
      <div class="collapse navbar-collapse" id="navbarResponsive">
        <ul class="navbar-nav ml-auto my-2 my-lg-0">
          <li class="nav-item">
            <a class="nav-link js-scroll-trigger" href="#start_learn">在线版</a>
          </li>
          <li class="nav-item">
            <a class="nav-link js-scroll-trigger" href="#start_learn">本地版</a>
          </li>
          <li class="nav-item">
            <a class="nav-link js-scroll-trigger" href="#contact">联系方式</a>
          </li>
        </ul>
      </div>
    </div>
  </nav>

  <!-- Masthead -->
  <header class="masthead">
    <div class="container h-100">
      <div class="row h-100 align-items-center justify-content-center text-center">
        <div class="col-lg-10 align-self-end">
          <h1 class="text-uppercase text-white font-weight-bold">Easy Python</h1>
          <hr class="divider my-4">
        </div>
        <div class="col-lg-8 align-self-baseline">
          <p class="text-white-75 font-weight-light mb-5">像玩游戏一样轻松学编程</p>
          <a class="btn btn-primary btn-xl js-scroll-trigger" href="#intro">了解更多</a>
        </div>
      </div>
    </div>
  </header>

  <!-- Online Section -->
  <section class="page-section bg-primary" id="intro">
    <div class="container">
      <div class="row justify-content-center">
        <div class="col-lg-10 text-center">
          <h2 class="text-white mt-0">游戏通关式学习法</h2>
          <hr class="divider light my-4">
          <iframe src="//player.bilibili.com/player.html?aid=74570448&cid=127549633&page=1" height="600" width="80%" scrolling="no" border="0" frameborder="no" framespacing="0" allowfullscreen="true"> </iframe>
          <p class="text-white-50 mb-4">点击播放查看详细</p>
          <p class="text-white-50 mb-4">一线教师精编教程 兼容新高考内容</p>
          <a class="btn btn-light btn-xl js-scroll-trigger" href="#start_learn">开始学习</a>
        </div>
      </div>
    </div>
  </section>

  <!-- Download Section -->
  <section class="page-section" id="start_learn">
    <div class="container">
      <h2 class="text-center mt-0">幸福二选一</h2>
      <hr class="divider my-4">
      <div class="row">
        <div class="col-lg-6 col-md-6 text-center">
          <div class="mt-5">
            <a href="https://mybinder.org/v2/gh/raingather/easy_python/online?urlpath=notebooks/tutorial"
              target="_blank">
              <i class="fas fa-4x fa-gem text-primary mb-4"></i>
              <h3 class="h4 mb-2">在线版(试用推荐)</h3>
            </a>
            <p class="text-muted mb-0">无需安装，点击即开始<br>速度较慢<br>不会保存你的源代码</p>
          </div>
        </div>
        <div class="col-lg-6 col-md-6 text-center">
          <div class="mt-5">
            <a href="http://115.159.200.72:8057/Easy_Python_Client/%E5%AE%89%E8%A3%85EasyPython.bat" target="_blank">
              <i class="fas fa-4x fa-laptop-code text-primary mb-4"></i>
              <h3 class="h4 mb-2">本地版</h3>
            </a>
            <p class="text-muted mb-0">运行速度快<br>本地保存所有代码<br>需要安装</p>
          </div>
        </div>
      </div>
    </div>
  </section>

  <!-- Contact Section -->
  <section class="page-section bg-primary" id="contact">
    <div class="container">
      <div class="row justify-content-center">
        <div class="col-lg-8 text-center">
          <h2 class="mt-0 text-white">联系与社群</h2>
          <hr class="divider my-4">
          <p class="mb-5 text-white-50">加入社群，互相学习</p>
        </div>
      </div>
      <div class="row">
        <div class="col-lg-4 ml-auto mr-auto text-center mb-5 mb-lg-0">
          <i class="fas fa-user-friends fa-3x mb-3 text-white"></i>
          <p class="mb-5 text-white">群号：820510014</p>
        </div>
      </div>
    </div>
  </section>

  <!-- Footer -->
  <footer class="bg-light py-5">
    <div class="container">
      <div class="small text-center text-muted">Copyright &copy; 2019 - Easy Python</div>
    </div>
  </footer>

  <!-- Bootstrap core JavaScript -->
  <script src="vendor/jquery/jquery.min.js"></script>
  <script src="vendor/bootstrap/js/bootstrap.bundle.min.js"></script>

  <!-- Plugin JavaScript -->
  <script src="vendor/jquery-easing/jquery.easing.min.js"></script>
  <script src="vendor/magnific-popup/jquery.magnific-popup.min.js"></script>

  <!-- Custom scripts for this template -->
  <script src="js/creative.min.js"></script>

</body>

</html>